<template>
  <div>
    <el-carousel class="scorollchart">
      <el-carousel-item class="item" v-for="side in sides" :key="side.id" >
        <h2 class="title"> {{ side.title }} </h2>
        <h3 class="sbutitle">{{ side.subtitle }} </h3>
        <h4 class="deputytitle">{{ side.deputytitle }}</h4>
        <img class="pic" src="side.pic" alt="">
      </el-carousel-item>
      <el-carousel-item>

      </el-carousel-item>
    </el-carousel>
  </div>
</template>

<script>
export default {
  data() {
    return {
      side: [
        {
          id: 1,
          title: '在校学生',
          subtitle: '轻松赚取',
          deputytitle: '奖励红包和惊喜礼物',
          pic: 'https://wj.qq.com/image/pc/act/join_1@2x.jpg',
        },
        {
          id: 1,
          title: '企业管理者',
          subtitle: '优先获得',
          deputytitle: '腾讯问卷行业报告',
          pic: 'https://wj.qq.com/image/pc/act/join_2@2x.jpg',
        },
        {
          id: 1,
          title: '自由职业者',
          subtitle: '亲自参与',
          deputytitle: '产品优化与迭代',
          pic: 'https://wj.qq.com/image/pc/act/join_3@2x.jpg',
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>

</style>
